getmyData('columnData', columnData)
let benDiDang1 = getmyData('columnData')
if (benDiDang1 == null) {
    setmyData('columnData', columnData)
    benDiDang1 = getmyData('columnData')
}

// 主内容节点
let columnList = document.getElementById('columnList')

// 添加内容
function showTable(data) {
    myTbody.innerHTML = ""
    data.forEach(item => {
        myTbody.innerHTML += `     <tr>
                                       <td><input type="checkbox" class="columnInput" onclick="jiHuo()"></td>
                                       <td class="col-md-2">${item.columnName}</td>
                                       <td class="col-md-2">${item.columnOrder}</td>
                                       <td class="col-md-4">${item.columnDescribe}</td>
                                       <td class="col-md-2"><label><input class="switch-btn switch-btn-animbg" type="checkbox" checked></label></td>
                                       <td class="col-md-2">
                                          <span class='columnedit' onclick = 'xiugaiStu(${JSON.stringify(item)})'>编辑</span>
                                          <span class="columnde">删除</span>
                                       </td>
                                    </tr>
                                </tbody>`
    });
}
showTable(benDiDang1)



//表格样式
// 表格标题高度
$('#tdheight>.table>thead>tr th').css({
    paddingTop: '0px',
    paddingBottom: '0px',
    height: '54px',
    color: '#333333',
    fontSize: '14px',
})
// tabody样式
$('#tdheight>.table tbody>tr ').css({
    paddingTop: '0px',
    paddingBottom: '0px',
})

// 第一排第一个图片居中
$('#tdheight>.table>thead>tr>th>img').eq(0).css({
    width: '14px',
    height: '14px'
})



// 点击删除
$('#myTbody').on('click', '.columnde', function () {
    let bdd = $(this).parents("tr").index()
    benDiDang1.splice(bdd, 1);
    showTable(benDiDang1)
    setmyData('columnData', benDiDang1)
    $('#lingLing').html(0)
    gaibianwenzi()
})

// 点击编辑
// $('#myTbody').on('click', '.columnedit', function () {
//     $('#editColumn').css({
//         display: 'block',
//     })

//     $('.whites').css({
//         background: 'rgba(127,128,129,0.7)',
//     })

//     $('#columnList').css({
//         zIndex: '-1',
//     })
// })
// let editColumn_1_inp
// let editColumn_2_inp
// let editColumn_3_inp
function xiugaiStu(data) {
    $('#editColumn').css({
        display: 'block',
    })

    $('.whites').css({
        background: 'rgba(127,128,129,0.7)',
    })

    $('#columnList').css({
        zIndex: '-1',
    })

    $('#one_heise').css({
        background: 'rgba(127,128,129,0.7)',
    })

    let editColumn_1_inp = document.getElementById('editColumn_1_inp')
    let editColumn_2_inp = document.getElementById('editColumn_2_inp')
    let editColumn_3_inp = document.getElementById('editColumn_3_inp')
    editColumn_1_inp.value = data.columnName
    editColumn_2_inp.value = data.columnOrder
    editColumn_3_inp.value = data.columnDescribe
}



// 编辑栏取消按钮
function clickCancel() {
    $('#editColumn').css({
        display: 'none',
    })

    $('.whites').css({
        background: 'rgb(240, 242, 245)',
    })

    $('#columnList').css({
        zIndex: '0',
    })

    $('#one_heise').css({
        background: 'rgb(240, 242, 245)',
    })

    // let editColumn_1_inp = document.getElementById('editColumn_1_inp')
    // let editColumn_2_inp = document.getElementById('editColumn_2_inp')
    // let editColumn_3_inp = document.getElementById('editColumn_3_inp')

    // editColumn_1_inp.value = ""
    // editColumn_2_inp.value = ""
    // editColumn_3_inp.value = ""
}


// 编辑栏 确认修改内容
$('.editColumn_4').on('click', '#clickDetermine', function () {
    // let editColumn_1_inp = $('#editColumn_1_inp').val()
    // let editColumn_2_inp = $('#editColumn_2_inp').val()
    // let editColumn_3_inp = $('#editColumn_3_inp').val()
    // let ahqb = new tihuanwenben(editColumn_1_inp, editColumn_2_inp, editColumn_3_inp)

    // function tihuanwenben(columnName, columnOrder, columnDescribe) {
    //     this.columnName = columnName
    //     this.columnOrder = columnOrder
    //     this.columnDescribe = columnDescribe
    // }

    // let haofano
    // $(".columnedit").each(function () {
    //     haofano = $(this).parents().parents().index()
    //     columnData.splice(haofano, 1, ahqb)
    //     $("#myTbody").find("tr:eq(" + haofano + ")").remove();
    // });
    // console.log(haofano);


    // editColumn_1_inp = $('#editColumn_1_inp')
    // editColumn_2_inp = $('#editColumn_2_inp')
    // editColumn_3_inp = $('#editColumn_3_inp')
    let editColumn_1_inp = document.getElementById('editColumn_1_inp')
    let editColumn_2_inp = document.getElementById('editColumn_2_inp')
    let editColumn_3_inp = document.getElementById('editColumn_3_inp')

    for (let i = 0; i < benDiDang1.length; i++) {
        if (benDiDang1[i].columnOrder == parseInt(editColumn_2_inp.value)) {
            benDiDang1[i].columnName = editColumn_1_inp.value
            // columnData[i].columnOrder = editColumn_2_inp.value
            benDiDang1[i].columnDescribe = editColumn_3_inp.value
            break;
        }
        console.log(benDiDang1[i].columnOrder);
    }
    clickCancel()
    gaibianwenzi()
    showTable(benDiDang1)
    setmyData('columnData', benDiDang1)
})




// input 选中的删除
function deleteSelected() {
    $('#checkShanc').css({
        display: 'block'
    })

    $('#columnList').css({
        zIndex: '-1',
    })

    $('.whites').css({
        background: 'rgba(127,128,129,0.8)',
    })

}

// 选中删除取消
function deleteSelectedCancel() {
    $('#checkShanc').css({
        display: 'none'
    })
    $('#columnList').css({
        zIndex: '0',
    })

    $('.whites').css({
        background: 'rgb(240, 242, 245)',
    })

}


var ndel
// 选中删除确认
$('#checkShanc').on('click', '#checkShanc_02', function () {
    $(".columnInput:checked").each(function () { // 遍历选中的checkbox
        ndel = $(this).parents("tr").index();  // 获取checkbox所在行的顺序
        benDiDang1.splice(ndel, 1)
        $('#lingLing').html(0)
        $("#myTbody").find("tr:eq(" + ndel + ")").remove();
        gaibianwenzi()


    });
    setmyData('columnData', benDiDang1)
    deleteSelectedCancel()
    showTable(benDiDang1)

})

// 根据选择的复选框改变文字数字
function gaibianwenzi() {
    // $('#lingLing').html(0)
    $(".columnInput").click(function () {
        // let shuJu = $(".columnInput:checkbox:checked").length;
        $('#lingLing').html($(".columnInput:checkbox:checked").length)
    })
}
gaibianwenzi()
// setInterval(gaibianwenzi(), 50)

function jiHuo() {
    gaibianwenzi()
}


// 添加
function addToContent() {
    $('#addColumn').css({
        display: 'block',
    })

    $('.whites').css({
        background: 'rgba(127,128,129,0.7)',
    })

    $('#columnList').css({
        zIndex: '-1',
    })

    $('#one_heise').css({
        background: 'rgba(127,128,129,0.7)',
    })
}

// 添加取消
function addToContentCancel() {
    $('#addColumn').css({
        display: 'none',
    })

    $('.whites').css({
        background: 'rgb(240, 242, 245)',
    })

    $('#columnList').css({
        zIndex: '0',
    })

    $('#one_heise').css({
        background: 'rgb(240, 242, 245)',
    })
    $('#addColumn_1_inp').val("")
    $('#addColumn_2_inp').val("")
    $('#addColumn_3_inp').val("")
    $('#addColumn_3_inp').attr("pla")
    console.log($('#addColumn_3_inp').val());
}




let nodeD


function addToContenConfirm() {
    let addColumnNeiRong_1 = $('#addColumn_1_inp').val()
    let addColumnNeiRong_2 = $('#addColumn_2_inp').val()
    let addColumnNeiRong_3 = $('#addColumn_3_inp').val()
    let abcd = new establish(addColumnNeiRong_1, addColumnNeiRong_2, addColumnNeiRong_3)
    function establish(columnName, columnOrder, columnDescribe) {
        this.columnName = columnName
        this.columnOrder = columnOrder
        this.columnDescribe = columnDescribe
    }

    // if()

    nodeD = benDiDang1.push(abcd)

    // columnData.push()
    // $('#myTbody').append("<tr> <td></td> <td></td> <td></td> <td></td> <td></td> <td></td></tr>")
    showTable(benDiDang1)
    addToContentCancel()
    gaibianwenzi()
    setmyData('columnData', benDiDang1)
}

// 点击文本框取消里面的文字
$('#addColumn_3_inp').focus(function () {
    $('#addColumn_3_inp').attr('placeholder', "")
})



